import React from "react";
import {DataTableColumn} from "mantine-datatable";
import {RecordProps} from "./interface";
import {renderColumnAction} from "./renderColumnAction";
import {Badge} from "@mantine/core";

// 引入ts类型，更容易知道哪些属性可以配置
export const renderColumns: DataTableColumn<RecordProps>[] = [
  {
    accessor: "version",
    title: "方案版本",
    render: ({version}) => (
      <Badge miw={50} variant="light" color="indigo" radius="md">
        {version}
      </Badge>
    ),
  },
  {
    accessor: "name", // 本列锚点（并不是一定是属性名）
    title: "方案名称", // 显示列名
    textAlign: "left", // 文本对齐（ipdv2要求：首列必须左对齐）
    width: 400, // 默认列宽
    ellipsis: true, // 超过列宽显示为省略号
    resizable: true, // 列宽可调
  },
  {accessor: "createdByUserName", title: "创建人"},
  {accessor: "createdByUserId", title: "创建人账号"},
  {accessor: "createdTime", title: "创建时间"},
  {
    accessor: "actions",
    title: "操作",
    render: renderColumnAction,
  },
];
